<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    
    <!-- <input type="text" id="inp">
    <div id="div" style="width: 200px; height:200px; background-color:black"></div> 

    <script>
//练习:取消事件
   
        var input = document.getElementById("inp");
            input.onfocus = function () {
                    alert('获得焦点');
            }
        var fn=function(){
             

            input.onblur = function () {
                alert('失去焦点');
            }
        }
        btn.addEventListener('click',fn,false);
        btn.removeEventListener('click',fn,false);

    </script> -->



        <div id="div">
            <input type="radio" name="a" id="" value="banana">香蕉
            <input type="radio" name="a" id="" value="apple">苹果
            <input type="radio" name="a" id="" value="orange">橘子
         
        </div>
        <p></p>
    <script>
        var div = document.getElementById('div');
        var input = document.getElementsByTagName('input');
        var len = input.length;
        var p = document.querySelector('p');
        // div.onchange = function () {
        //     for (var i = 0; i < len; i++) {
        //         if (input[i].checked == true) {
        //             p.innerText = '您选择的是'+input[i].value;
        //         }
        //     }
        // }
//onchange获取多选框的值
        all=[];
        div.onchange=function () {
            for (let i = 0; i < len; i++) {
                if (input[i].checked=false) {
                    all.push(input[i].value)
                } 
            }
        }
        p.innerText = '您选择的是'+input[i].value;
    </script> 
   


</body>
</html>